// 响应比
@media (max-width: 1263px) {
  .blog-container {
    &> .card-container> .home-container> .swiper-wrapper {
      height: 400px !important;
    }

    &> .card-container> .home-container> .index_article-list> .index_article-item {
      height: 10rem;
  
      &> .index_article-cover {
        width: 12rem;
        height: 8rem;
      }
  
      &> .index_article-info {
        width: calc(100% - (7.5rem + 15px));
  
        &> .article-meta> .meta-item> .item-view {
          display: none;
        }
        &> .article-meta> .meta-item> .item-comment {
          display: none;
        }
      }
    }
  }

  
  // 为了让带ArticleList组件的页面响应比仍然生效
  .page-container> .card-container> .home-container> .tags-article-container> .index_article-list> .index_article-item {
    height: 10rem;

    &> .index_article-cover {
      width: 12rem;
      height: 8rem;
    }

    &> .index_article-info {
      width: calc(100% - (7.5rem + 15px));

      &> .article-meta> .meta-item> .item-view {
        display: none;
      }
      &> .article-meta> .meta-item> .item-comment {
        display: none;
      }
    }
  }
}

@media (min-width: 769px) and (max-width: 960px) {
  .banner-container {
    height: calc(90vh) !important;
  }
  .sidebar-container {
    display: none;
  }
  .blog-container {
    &> .card-container {
      width: 100%;
      margin-left: 0;
  
      &> .home-container {
        &> .swiper-wrapper {
          height: 350px !important;
        }

        &> .index_article-list {
          &> .index_article-item {
            height: 12rem;
        
            .index_article-cover {
              width: 16.875rem;
              height: 10rem;
            }
        
            &> .index_article-info {
              width: calc(100% - 210px);
        
              &> .article-meta> .meta-item> .item-view {
                display: flex;
              }
              &> .article-meta> .meta-item> .item-comment {
                display: flex;
              }
            }

          }
        }
      }
    }
  }
  .page-container {
    &> .card-container {
      width: 100%;
      margin-left: 0;

      &> .home-container {
        &> .swiper-wrapper {
          height: 350px !important;
        }

        &> .index_article-list {
          &> .index_article-item {
            height: 12rem;
        
            .index_article-cover {
              width: 16.875rem;
              height: 10rem;
            }
        
            &> .index_article-info {
              width: calc(100% - 210px);
        
              &> .article-meta> .meta-item> .item-view {
                display: flex;
              }
              &> .article-meta> .meta-item> .item-comment {
                display: flex;
              }
            }

          }
        }
      }

    }
  }
  
}

@media (max-width: 768px) {
  .banner-container {
    height: calc(70vh) !important;
  }
  .blog-container {
    width: 100% !important;
    padding: 0 !important;

    &> .sidebar-container {
      display: none;
    }

    &> .card-container {
      width: 100%;
      margin-left: 0;

      &> .home-container {
        &> .swiper-wrapper {
          height: 300px !important;
        }

        &> .index_hot-list {
          grid-template-columns: repeat(2,1fr);
          gap: 10px;
        }
      }
    }
  }

  .page-container {
    width: 100% !important;
    padding: 0 !important;

    &> .sidebar-container {
      display: none;
    }

    &> .card-container {
      width: 100%;
      margin-left: 0;
    }
  }
  
  .index_article-info {
    &> .article-meta> .meta-item> .item-view {
      display: none;
    }
    &> .article-meta> .meta-item> .item-comment {
      display: none;
    }
    &> .article-meta> .meta-item> .item-tags {
      display: none;
    }
  }
}

@media (max-width: 560px) {
  .blog-container {
    padding: 0 !important;
    margin: 0 !important;

    &> .card-container {

      &> .home-container {
        border-radius: 0;

        &> .swiper-wrapper {
          width: 100%;
          height: 220px !important;
        }

        &> .index_article-list {
          &> .index_article-item {
            height: 7rem;
        
            &> .index_article-cover {
              width: 7.5rem;
              height: 5rem;
            }
        
            .index_article-info {
              // width: calc(100% - (7.5rem + 15px));
        
              .article-abstract {
                display: none;
              }
              .article-title {
                margin-bottom: 2.1875rem;
              }
              &> .article-meta> .meta-item> .item-tags {
                display: none;
              }
              &> .article-meta> .meta-item> .item-view {
                display: none;
              }
              &> .article-meta> .meta-item> .item-comment {
                display: none;
              }
            }
          }
        }
      }

      &> .dynamics-container {
        display: none;
      }
    } 
  }

  .page-container> .card-container> .home-container> .tags-article-container {
    &> .index_article-list {
      &> .index_article-item {
        height: 7rem;
    
        &> .index_article-cover {
          width: 7.5rem;
          height: 5rem;
        }
    
        .index_article-info {
          // width: calc(100% - (7.5rem + 15px));
    
          .article-abstract {
            display: none;
          }
          .article-title {
            margin-bottom: 2.1875rem;
          }
          &> .article-meta> .meta-item> .item-tags {
            display: none;
          }
          &> .article-meta> .meta-item> .item-view {
            display: none;
          }
          &> .article-meta> .meta-item> .item-comment {
            display: none;
          }
        }
      }
    }
  }
}

// 动画样式
@keyframes jump {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.2);
  }
}